<template>
    <view class="workerDetial">
        <view class="content">
            <view class="head flex_b">
                <view class="head_l">预估费用</view>
                <view class="head_r">
                    <view class="money">¥{{ (orderDetail.pay as number).toFixed(2) }}</view>
                    <view class="type">（{{ orderDetail.workType }}）</view>
                </view>
            </view>
            <view class="tips">
                <image src="@/static/images/customerPage/icon_tips.png" />
                <text>此费用为预估费用，结算时按照实际费用结算</text>
            </view>
            <view class="detial">
                <view class="flex_b">
                    <view>付费模式</view>
                    <view style="font-weight: bold;">{{ orderDetail.feeType == 1 ? '一口价' : '计件' }}</view>
                </view>
                <view class="flex_b mt24">
                    <view>{{
                        `工时工种费（${orderDetail.unitPrice}元）*${orderDetail.peopleNum}${ orderDetail.feeType == 1 ?'人':'件'}` }}</view>
                    <view style="font-weight: bold;">{{ `¥${((orderDetail.unitPrice as number)*(orderDetail.workHour as number) * orderDetail.peopleNum).toFixed(2)}` }}</view>
                </view>
            </view>
            <view class="total flex_b mt24">
                <view>合计</view>
                <view style="font-weight: bold;">{{ `¥${(orderDetail.pay as number).toFixed(2)}` }}</view>
            </view>
            <view class="total flex_b mt24">
                <view>优惠券</view>
                <view style="font-weight: bold;color: #ff382e;">{{ `-${(orderDetail.couponMoney as number).toFixed(2)}` }}</view>
            </view>
            <view class="describe mt16">
                保险：平台赠送。
            </view>
        </view>
        <view class="describe2 mt24" @click="toInsurance">本次赠送仅给抢单师傅提供保险，抢单师傅另外带人一起，不包含保险在内，点击查看保险保障内容。</view>
        <!-- 底部按钮 -->
        <view class="bottom_btn">
            <view class="btn flex_c" @click="pay">确认支付</view>
        </view>
    </view>
</template>


<script lang="ts" setup>
import { onLoad } from "@dcloudio/uni-app";
import { useOrder } from "@/hooks/useOrder";
const { orderDetail, getOrderInfo } = useOrder()
import { usePay } from "@/hooks/usePay";
const { getPayOrderInfo, submitPay } = usePay()

onLoad((options: any) => {
    const { id } = options
    if (id) {
        // 查询订单详情
        getOrderInfo(id)
        // 查询支付id
        getPayOrderInfo(id)
    }
})
const pay = (async () => {
    submitPay()
})
// 跳转到保险保障
const toInsurance = () => {
  uni.navigateTo({
    url: "/pages/public/insurance/insurance"
  })
}
</script>

<style lang="scss" scoped>
@import "./workerDetial.scss";
</style>